<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>学生管理</title>
</head>

<body>
  <div class="easyui-layout" data-options="fit:true,border:false">
    <div data-options="region:'west',split:true,hideCollapsedContent:false,title:'专业类别'" style="width:240px;">
      <ul id="student_tree-20210607"></ul>
    </div>
    <div data-options="region:'center',border:true">
      <div id="toolbar20210220" style="padding: 4px;">
        <form>
          <a href="javascript:" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="$('#student_management-20210607').dialog('open').dialog('center').dialog('setTitle','添加')">添加</a>
          <a href="javascript:" class="easyui-linkbutton" iconCls="icon-no" plain="true" onclick="delStudentmsg20210607()">删除</a>
<!--          <a href="javascript:" class="easyui-linkbutton" iconCls="icon-edit" plain="true">修改</a>-->
          <a href="javascript:" class="easyui-linkbutton"  plain="true" onclick="$('#student_upload-20210609').dialog('open').dialog('center').dialog('setTitle','上传')">Excel导入</a>
          <a href="javascript:location.href='./../excel/学生信息导入模版.xlsx'" class="easyui-linkbutton"  plain="true">Excel模版下载</a>

        </form>
      </div>
      <table id="menu_edit_20181029"></table>
    </div>
  </div>

  <div id="student_management-20210607" style="padding:10px 10px;display: none;">
    <form id="submitFormStudent20210607_form" method="post" data-options="novalidate:true">
      <div style="margin-bottom:20px">
        <input class="easyui-textbox" name="id" id="idandkaohao" style="width:100%" data-options="label:'学号:',required:true">
      </div>
      <div style="margin-bottom:20px">
        <input class="easyui-textbox" name="name" style="width:100%" data-options="label:'姓名:',required:true">
      </div>
      <div style="margin-bottom:20px">
        <input class="easyui-textbox" name="sfz" style="width:100%" data-options="label:'身份证:',required:true">
      </div>
      <div style="margin-bottom:20px">
        <select class="easyui-combobox" name="sex" style="width:100%"  data-options="label:'性别:',panelHeight:'auto'" >
          <option value="1">男</option>
          <option value="2">女</option>
        </select>
      </div>
      <div style="margin-bottom:20px">
        <input class="easyui-filebox" name="headSculpture" data-options="label:'照片:',prompt:'2寸免冠照',buttonText: '选择要图片'" style="width:100%">
      </div>
      <div style="margin-bottom:20px">
        <input class="easyui-textbox" name="remarks" style="width:100%;height:60px" data-options="label:'备注:',multiline:true">
      </div>
      <div style="margin-bottom:20px">
        <select class="easyui-combobox" name="status" data-options="label:'状态:',panelHeight:'auto'" >
          <option value="1">正常</option>
          <option value="2">休学</option>
          <option value="3">当兵</option>
          <option value="4">退学</option>
          <option value="5">停考</option>
        </select>
      </div>
    </form>
  </div>
  <div id="student_management-20210607_button" style="display: none;">
    <a class="easyui-linkbutton"  href="javascript:" >放弃</a>
    <a class="easyui-linkbutton" onclick="submitFormStudent20210607()"  href="javascript:">保存</a>
  </div>

  <div id="student_upload-20210609" style="padding:10px 10px;display: none;">
    <form id="studentExcelUpload20210609" method="post" data-options="novalidate:true" enctype="multipart/form-data" >
      <div style="margin-bottom:20px">
        <input class="easyui-filebox" name="fileExcelTem" data-options="buttonText: '选中要导入的Excel',accept: '.xlsx',required:true" style="width:100%">
      </div>
      <div style="margin-bottom:20px">
        <a  href="javascrip:" class="easyui-linkbutton" data-options="" style="width:100px;" onclick="submitForm2010609()">导入数据</a>
      </div>
    </form>
  </div>

  <script>
    function submitForm2010609() {

      if(!$('#studentExcelUpload20210609').form('enableValidation').form('validate')){
        return;
      }

      //添加对话框，上传控件初始化
      $.messager.progress({
        title:'Please waiting',
        msg:'数据保存中，请稍后...'
      });

      $('#studentExcelUpload20210609').form('submit',{
        iframe:false,
        url:'./../studentInformation/mergeStudentInformationExcel',
        onSubmit:function(param){
          let treeSelect = $('#student_tree-20210607').tree('getSelected');
          param.pid = treeSelect.id;
          // param.kaohao = $('#idandkaohao').textbox('getValue');
          return $(this).form('enableValidation').form('validate');
        },
        onProgress:function (percent){
          console.log(percent)
        },
        success:function(json){
          $.messager.progress('close');
          let data = eval('(' + json + ')');
          if(data.code == 200){
            new jBox('Notice', {
              color: 'green',
              autoClose: 5000,
              content: '成功，导入数据：'+data.data+' 行',
              showCountdown: true,
              animation: 'slide'
            });
            $('#student_upload-20210609').dialog('close');
            $('#menu_edit_20181029').datagrid('load');
          }else{
            new jBox('Notice', {
              color: 'red',
              autoClose: 2500,
              content: '导入失败！！',
              showCountdown: true,
              animation: 'slide'
            });
          }
        }
      });

    }

    //var colors = ['red', 'green', 'blue', 'yellow'];
    function delStudentmsg20210607(){
      var row = $('#menu_edit_20181029').datagrid('getSelected');
      if (!row){
        new jBox('Notice', {
          color: 'blue',
          autoClose: 2500,
          content: '请选中一行数据后，再操作！！',
          showCountdown: true,
          animation: 'slide'
        });
        return;
      }
      $.messager.confirm('提升','确定要删除吗？删除后将不能恢复！！',function(r){
        if (r){
          $.getJSON('./../studentInformation/delStudentInformation',{id:row.id}, function(json){
            if(json.code == 200){
              new jBox('Notice', {
                color: 'green',
                autoClose: 2500,
                content: '删除成功。',
                showCountdown: true,
                animation: 'slide'
              });
              $('#menu_edit_20181029').datagrid('load');
            }else{
              new jBox('Notice', {
                color: 'red',
                autoClose: 2500,
                content: '删除失败！！',
                showCountdown: true,
                animation: 'slide'
              });
            }
          });
        }
      });
    }

    $(function () {
      $.getJSON('./../category/getCategory',{state:1}, function(json){
        let data = json.rows;
        $('#student_tree-20210607').tree({
          data: data
        });
      });

      //设备类别tree结构
      $('#student_tree-20210607').tree({
        onLoadSuccess: function (node, data) {
          //$(this).tree('collapseAll');
        },
        animate:true,
        formatter:function(node){
          var s = node.text;
          if (node.children){
            s += '&nbsp;<span style=\'color:blue\'>(' + node.children.length + ')</span>';
          }
          return s;
        },
        onClick: function(node){
          let treeIsLeaf = $(this).tree('isLeaf', node.target);
          if(treeIsLeaf){
            $('#menu_edit_20181029').datagrid({
              url: './../studentInformation/queryStudentInformationPid',
              queryParams: {
                pid: node.id
              }
            });
          }
        },
        onContextMenu: function(e, node){
          e.preventDefault();
          // select the node
          $(this).tree('select', node.target);

          // //判断是否是叶节点
          // let treeIsLeaf = $(this).tree('isLeaf', node.target);
          // let add0606zjd = $('#tree-add0606zjd')[0];
          // //隐藏和显示菜单指定栏目
          // if(treeIsLeaf){
          //   $('#treeCRUD20200606').menu('hideItem', add0606zjd);
          // }else{
          //   $('#treeCRUD20200606').menu('showItem', add0606zjd);
          // }
          // //得到父节点
          // let treeParent = $(this).tree('getParent', node.target);
          // //if(treeIsLeaf){
          // console.log(node,treeParent);
          // //}
          //
          // // display context menu
          // $('#treeCRUD20200606').menu('show', {
          //   left: e.pageX,
          //   top: e.pageY
          // });
        }
      });
    });

    $('#menu_edit_20181029').datagrid({
      method: 'get',
      border: false,
      fit: true,
      fitColumns: true,
      scrollbarSize: 2, //滚动条宽度
      striped: true,
      rownumbers: true,
      pagination: true,
      singleSelect: true,
      sortName: 'id',   //定义排序的列名
      sortOrder: 'desc',   //'asc' 或 'desc'。
      nowrap:false, //设置为 true，则把数据显示在一行里。设置为 true 可提高加载性能。
      columns:[[
        {field:'idD',title:'id',width:80,hidden:true},
        {field:'updateTime',title:'年/级',width:80,hidden:true},
        {field:'categoryId',title:'专业',width:80,hidden:true},
        {field:'id',title:'学号',width:80},
        {field:'name',title:'姓名',width:80},
        {field:'sex',title:'性别',width:80,
          formatter: function(value,row,index){
            if (value == 1){
              return '男';
            } else {
              return '女';
            }
          }
        },
        {field:'type',title:'成绩',width:80},
        {field:'tonnage',title:'考试次数',width:80,
          formatter: function(value,row,index){
            if (parseInt(value) > 1){
              return '<a href="javascript:" title="展示历史考试情况：' +
                      '<br/>' +
                      '1、2020-10-21：32分' +
                      '<br/>' +
                      '2、2020-12-22：88分' +
                      '" class="note">' + value + '</a>';
            }else{
              return value;
            }
          }
        },
        {field:'contactsPhone',title:'联系电话',width:80,hidden:true},
        {field:'detail',title:'设备详情描述',width:80,hidden:true},
        {field:'status',title:'考试状态',width:80,
          formatter: function(value,row,index){
            if (value == 1){
              return '<span class="easyui-dot easyui-status-processing"></span> 正常';
            } else {
              return '<span class="easyui-dot easyui-status-error"></span> 其他';
            }
          },
          align:'left'
        },
        {field:'month',title:'备注',width:80}
      ]],
      onRowContextMenu:function(e,index,row){
        e.preventDefault();
        $(this).datagrid('unselectAll');
        var addZ = $('#m-delete-20190722')[0];
        var update = $('#m-update-20190722')[0];
        if(!row){
          $('#mm_20181030').menu('hideItem', addZ).menu('hideItem', update);
        }else{
          $('#mm_20181030').menu('showItem', addZ).menu('showItem', update);
          $(this).datagrid('selectRow', index);
        }
        $('#mm_20181030').menu('show', {
          left:e.pageX,
          top:e.pageY
        });
      },
      onHeaderContextMenu: function(e, field) {
        e.preventDefault();
        $(this).datagrid('columnMenu').menu('show', {
          left: e.pageX,
          top: e.pageY
        });
      },
      onDblClickRow:function(index,row){
        $(this).datagrid('selectRow', index);

        $('#uploadImage20200602Button').show();
        $('#dialog_20190723_addOrUpdateOrMenu').dialog('open').dialog('center').dialog('setTitle','修改');
      },
      onLoadSuccess:function(data){
        $(".note").tooltip({
          position: 'right',
          onShow: function(){
            $(this).tooltip('tip').css({
              width:'260',
              boxShadow: '1px 1px 3px #292929'
            });
          }
        });
      },
      toolbar:'#toolbar20210220'
    });

    $(function (){
      $('#student_management-20210607').dialog({
        width: '50%',
      //  height: '50%',
        closed: true,
        modal: true,
        onBeforeOpen: function (none){
          let treeSelect = $('#student_tree-20210607').tree('getSelected');
          if(treeSelect){
            if($('#student_tree-20210607').tree('isLeaf',treeSelect.target)){
              return true;
            }
          }
          new jBox('Notice', {
            color: 'blue',
            autoClose: 2500,
            content: '请先选中科目！!',
            showCountdown: true,
            animation: 'slide'
          });
          return false;
        },
        buttons:'#student_management-20210607_button'
      });

      //上传对话框
      $('#student_upload-20210609').dialog({
        width: '50%',
        //  height: '50%',
        closed: true,
        modal: true,
        onBeforeOpen: function (none){
          let treeSelect = $('#student_tree-20210607').tree('getSelected');
          if(treeSelect){
            if($('#student_tree-20210607').tree('isLeaf',treeSelect.target)){
              return true;
            }
          }
          new jBox('Notice', {
            color: 'blue',
            autoClose: 2500,
            content: '请先选中科目！!',
            showCountdown: true,
            animation: 'slide'
          });
          return false;
        }
      });
    });

    function submitFormStudent20210607(){
      $.messager.progress({
        title:'Please waiting',
        msg:'数据保存中，请稍后...'
      });
      $('#submitFormStudent20210607_form').form('submit',{
        url:'./../studentInformation/mergeStudentInformation',
        onSubmit:function(param){
          let treeSelect = $('#student_tree-20210607').tree('getSelected');
          param.pid = treeSelect.id;
          param.kaohao = $('#idandkaohao').textbox('getValue');
          return $(this).form('enableValidation').form('validate');
        },
        success:function(json){
          $.messager.progress('close');
          let data = eval('(' + json + ')');
          if(data.code == 200){
            new jBox('Notice', {
              color: 'green',
              autoClose: 2500,
              content: '保存成功。',
              showCountdown: true,
              animation: 'slide'
            });
            $('#student_management-20210607').dialog('close');
            $('#menu_edit_20181029').datagrid('load');
          }else{
            new jBox('Notice', {
              color: 'red',
              autoClose: 2500,
              content: '保存失败！',
              showCountdown: true,
              animation: 'slide'
            });
          }
        }
      });
    }
  </script>

</body>
</html>